<template>
  <div>
      应用列表
      <div class="tab_byns">
        <el-button type="primary" size="small" @click="toFormHandler">新增</el-button>
      </div>
      <div class="tab_content">          
          <el-table
      :data="applications"
      style="width: 100%">
      <el-table-column
        prop="appId"
        label="应用程序ID"
        width="180">
      </el-table-column>
      <el-table-column
        prop="appKey"
        label="应用程序密钥"
        width="180">
      </el-table-column>
			<el-table-column prop="createTime" label="创建时间">
	      <template slot-scope="scope">
	        {{scope.row.createTime | fmtDate}}
	      </template>  
	      </el-table-column>
       <el-table-column
        prop="email"
        label="邮箱"
        width="180">
      </el-table-column>
      <el-table-column
        prop="id"
        label="ID"
        width="180">
      </el-table-column>
      <el-table-column
        prop="introduce"
        label="简介">
      </el-table-column>
      <el-table-column
        prop="latitude"
        label="纬度"
        width="180">
      </el-table-column>
      <el-table-column
        prop="longitude"
        label="经度">        
      </el-table-column>
      <el-table-column
        prop="name"
        label="名字">        
      </el-table-column>
      <el-table-column
        prop="secretKey"
        label="密码">        
      </el-table-column>
      <el-table-column
        prop="telephone"
        label="电话">        
      </el-table-column>
      <el-table-column
        prop="type"
        label="类型">        
      </el-table-column>
      <el-table-column
        prop="userId"
        label="用户ID">        
      </el-table-column>  
          <el-table-column width="100" align="center" label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="editHandler(scope.row)">修改</el-button>
            <el-button type="text" @click="deleteHandler(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
  </div>
  </div>
</template>

<script>
import {del, get} from "@/utils/request"
export default {
//定义变量，在模板中直接用
    data(){
        return {
            applications:[],
            visible:false
        }
    },

    //定义事件处理函数、方法
    methods:{  
      // 删除函数
    deleteHandler(row){
       this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let url = "http://localhost:8888/application/deleteById"
        del(url,{id:row.id}).then(resp =>{
          // 1. 提示
          this.$message({type:"success",message:resp.message});
          // 2. 刷新
          this.loadApplications();
        })
      })
    },

    // 修改函数
    editHandler(row){
      this.$router.push({ 
        path:"/yzy/applicationform" ,
        query:row
      })
    }, 
      toFormHandler(){
        // 跳转
        this.$router.push({ path:"/yzy/applicationform" })
      },
        //查询所有数据
        loadApplications(){      
            let url = "http://localhost:8888/application/query"
            get(url).then(resp => {
                //获取数据后做的事情
                this.applications = resp.data;
                // console.log(this.applications);
            })
        }
      },
      //生命周期钩子函数
    created(){
       this.loadApplications();
    }

}


</script>

<style lang="sass" scoped>

</style>